<template>
	<div class="ImgBg1">
		<div style="height: 80px;">
			<div class="topBar">
				<div class="secondBar">
					<div class="imgBox">
						<img style="height: 60px;width: 100px;" src="../../../assets/img/baoxian.png" />
					</div>
					<div class="lineBar"></div>
					<span class="title">惠企链惠单平台</span>
				</div>
			</div>
		</div>

		<div class="fatherBox" v-if="active == 1">
			<div style="width: 100%;height: 80px;border-bottom: 1px solid #EEEEEE;">
				<el-steps style="margin-top: 30px;" :active="active" align-center>
					<el-step title="设置企业信息"></el-step>
					<el-step title="设置用户信息"></el-step>
					<el-step title="提交认证资料"></el-step>
					<el-step title="等待审核"></el-step>
				</el-steps>
			</div>
			<div style="height: 120px;width: 100%;">
				<div style="width: 280px;height: 120px;margin: 0 auto;display: flex;">
					<div style="width: 60px;height: 3px;background-color: #1890FF;align-self: center;"></div>
					<div style="font-size: 20px;font-weight: bold;line-height: 120px;padding: 0 20px 0 20px;">企业基本信息
					</div>
					<div style="width: 60px;height: 3px;background-color: #1890FF;align-self: center;"></div>
				</div>
			</div>
			<div class="formBox">
				<el-form status-icon :model="dataForm" :rules="rules" ref="dataForm" label-width="200px"
					class="demo-ruleForm">
					<el-form-item label="企业名称">
						<div>{{this.dataForm.customerName}}</div>
					</el-form-item>
					<el-form-item label="邀请码" prop="yaoqingma">
						<el-input v-model="dataForm.yaoqingma"></el-input>
					</el-form-item>
         <!-- <el-form-item label="企业类型" prop="yaoqingma">
          <el-select v-model="dataForm.customerType" style="width: 100%" filterable clearable placeholder="请选择企业类型">
            <el-option v-for="option in options.customerTypes" :key="option.key" :label="option.lable" :value="option.key" />
          </el-select>
          </el-form-item> -->

					<el-form-item label="统一社会信用代码" prop="bizLicenceNo">
						<el-input v-model="dataForm.bizLicenceNo"></el-input>
					</el-form-item>
					<el-form-item label="法人/股东姓名" prop="ownerName">
            <el-input v-model="dataForm.ownerName"></el-input>
					</el-form-item>
          <el-form-item label="法人/股东证件类型" prop="ownerIdType">
            <el-select v-model="dataForm.ownerIdType" style="width: 100%" filterable clearable placeholder="请选择企业类型">
              <el-option v-for="option in options.ownerIdTypes" :key="option.key" :label="option.lable" :value="option.key" />
             </el-select>
          </el-form-item>

					<el-form-item label="法人/股东证件号码" prop="ownerIdNo">
						<el-input v-model="dataForm.ownerIdNo"></el-input>
					</el-form-item>
					<el-form-item label="企业地址" prop="address">
						<el-input v-model="dataForm.address"></el-input>
					</el-form-item>

				</el-form>
			</div>
			<div style="height: 120px;width: 100%;">
				<div style="width: 280px;height: 120px;margin: 0 auto;display: flex;">
					<div style="width: 60px;height: 3px;background-color: #1890FF;align-self: center;"></div>
					<div style="font-size: 20px;font-weight: bold;line-height: 120px;padding: 0 20px 0 20px;">企业银行账户
					</div>
					<div style="width: 60px;height: 3px;background-color: #1890FF;align-self: center;"></div>
				</div>
			</div>
			<div class="formBox">
				<el-form status-icon :model="dataForm" :rules="rules2" ref="dataForm2" label-width="200px"
					class="demo-ruleForm">
					<el-form-item label="银行账号" prop="bankAccount">
						<el-input v-model="dataForm.bankAccount"></el-input>
					</el-form-item>
					<el-form-item label="账户名称" prop="bankDepositName">
						<el-input v-model="dataForm.bankDepositName"></el-input>
					</el-form-item>
					<el-form-item label="开户行" prop="bankName">
						<el-input v-model="dataForm.bankName"></el-input>
					</el-form-item>
					<el-form-item label="开户网点" prop="bankOpenBranch">
					<!-- 	<el-input autocomplete="off" v-model="dataForm.bankOpenBranch"></el-input> -->
            <el-input v-model="dataForm.bankOpenBranch"></el-input>
					</el-form-item>
					<el-form-item label="具体网点" prop="bankAddress">
						<el-input autocomplete="off" v-model="dataForm.bankAddress"></el-input>
					</el-form-item>
				</el-form>
				<!-- <div class="gotop" v-show="gotop" @click="toTop">Top</div> -->
			</div>
			<div
				style="width: 100%;height: 100px;margin: 0 auto;display: flex;margin-top: 100px;box-shadow: 0px 0px 10px 0px #b8b8b8;">
				<div style="width: 100px;height: 40px;margin: 0 auto;display: flex;align-self: center;">
					<el-button type="primary" @click="submitForm('dataForm','dataForm2')" size="medium">下一步</el-button>
				</div>
			</div>
		</div>


		<div class="fatherBox" v-if="active == 2">
			<div style="width: 100%;height: 80px;border-bottom: 1px solid #EEEEEE;">
				<el-steps style="margin-top: 30px;" :active="active" align-center>
					<el-step title="设置企业信息"></el-step>
					<el-step title="设置用户信息"></el-step>
					<el-step title="提交认证资料"></el-step>
					<el-step title="等待审核"></el-step>
				</el-steps>
			</div>
			<div style="height: 120px;width: 100%;">
				<div style="width: 280px;height: 120px;margin: 0 auto;display: flex;">
					<div style="width: 60px;height: 3px;background-color: #1890FF;align-self: center;"></div>
					<div style="font-size: 20px;font-weight: bold;line-height: 120px;padding: 0 20px 0 20px;">用户信息
					</div>
					<div style="width: 60px;height: 3px;background-color: #1890FF;align-self: center;"></div>
				</div>
			</div>
			<div class="formBox">
				<el-form status-icon :model="adminForm" :rules="rules3" ref="dataForm3" label-width="200px"
					class="demo-ruleForm">
					<el-form-item label="登录名" prop="userName">
						<el-input v-model="adminForm.userName"></el-input>
					</el-form-item>
					<el-form-item label="用户姓名" prop="nickName">
						<el-input v-model="adminForm.nickName"></el-input>
					</el-form-item>
					<el-form-item label="证件类型" prop="ownerIdType">
            <el-select v-model="adminForm.ownerIdType" style="width: 100%" filterable clearable placeholder="请选择证件类型">
              <el-option v-for="option in options.ownerUserIdTypes" :key="option.key" :label="option.lable" :value="option.key" />
             </el-select>
					</el-form-item>

					<el-form-item label="证件号码" prop="idCardNo">
            <el-input v-model="adminForm.idCardNo"></el-input>

					</el-form-item>
					<el-form-item label="邮箱" prop="email">
                <el-input v-model="adminForm.email"></el-input>

					</el-form-item>
				</el-form>
			</div>
			<div
				style="width: 100%;height: 100px;margin: 0 auto;display: flex;margin-top: 100px;box-shadow: 0px 0px 10px 0px #b8b8b8;">
				<div style="width: 100px;height: 40px;margin: 0 auto;display: flex;align-self: center;">
					<el-button type="infor" @click="backUser" size="medium">上一步</el-button>
					<el-button type="primary" @click="goAuth('dataForm3')" size="medium">下一步</el-button>
				</div>
			</div>
		</div>

		<div class="fatherBox" v-if="active == 3">
			<div style="width: 100%;height: 80px;border-bottom: 1px solid #EEEEEE;">
				<el-steps style="margin-top: 30px;" :active="active" align-center>
					<el-step title="设置企业信息"></el-step>
					<el-step title="设置用户信息"></el-step>
					<el-step title="提交认证资料"></el-step>
					<el-step title="等待审核"></el-step>
				</el-steps>
			</div>
<div style="height: 120px;width: 100%;">
				<div style="width: 280px;height: 120px;margin: 0 auto;display: flex;">
					<div style="width: 60px;height: 3px;background-color: #1890FF;align-self: center;"></div>
					<div style="font-size: 20px;font-weight: bold;line-height: 120px;padding: 0 20px 0 20px;">上传资料认证
					</div>
					<div style="width: 60px;height: 3px;background-color: #1890FF;align-self: center;"></div>
				</div>
			</div>
			<div style="width: 100%;height: 20px;font-size: 18px;margin-left: 30px;">
				<i class="el-icon-upload"></i>请使用扫描或者实拍图片，要求文字清晰易识别，PS不能通过审核。照片支持jpg/jpeg/bmp/png，大小不超过5M.
			</div>
			<el-divider></el-divider>
			<div style="display: flex;width: 95%;margin: 0 auto;">
				<el-card style="width: 45%;height: 300px;" class="box-card">
					<div slot="header" class="clearfix">
						<span style="font-weight: bold;">统一社会信用代码证(图片大小不超过5M)</span>
					</div>
					<el-upload :action="upLoadUrl" list-type="picture-card"
						:on-preview="handlePictureCardPreview1" :limit="1" :on-remove="handleRemove1" :on-success="fileUpload1"
						:headers="headerObj" accept=".pdf,.jpg,.png">
						<i class="el-icon-plus"></i>
					</el-upload>
					<el-dialog :visible.sync="dialogVisible1">
						<img width="100%" :src="dialogImageUrl1" alt="">
					</el-dialog>
				</el-card>
				<el-card style="width: 45%;height: 300px;margin-left: 10%;" class="box-card">
					<div slot="header" class="clearfix">
						<span style="font-weight: bold;">法人代表证照(图片大小不超过5M)</span>
					</div>
					<el-upload :action="upLoadUrl" list-type="picture-card"
						:on-preview="handlePictureCardPreview2" :limit="1" :on-remove="handleRemove2" :on-success="fileUpload2"
						:headers="headerObj">
						<i class="el-icon-plus"></i>
					</el-upload>
					<el-dialog :visible.sync="dialogVisible2">
						<img width="100%" :src="dialogImageUrl2" alt="">
					</el-dialog>
				</el-card>
			</div>
			<div style="width: 95%;margin: 0 auto;display: flex;margin-top: 30px;">
				<div style="width: 50%;display: flex;"><i class="el-icon-upload"></i>统一社会信用代码证正本复印件，<div style="color: #FFBA00;">加盖公章</div>
				</div>
				<div style="width: 50%;margin-left: 10%;display: flex;"><i class="el-icon-upload"></i>法人证件原件照片，身份证则必须提供正反面，<div style="color: #FFBA00;">加盖公章</div>
				</div>
			</div>

			<div style="display: flex;width: 95%;margin: 0 auto;margin-top: 50px;">
				<el-card style="width: 45%;height: 300px;" class="box-card">
					<div slot="header" class="clearfix">
						<span style="font-weight: bold;">银行账户证明(图片大小不超过5M)</span>
					</div>
					<el-upload :action="upLoadUrl" list-type="picture-card"
						:on-preview="handlePictureCardPreview3" :limit="1" :on-remove="handleRemove3" :on-success="fileUpload3"
						:headers="headerObj">
						<i class="el-icon-plus"></i>
					</el-upload>
					<el-dialog :visible.sync="dialogVisible3">
						<img width="100%" :src="dialogImageUrl3" alt="">
					</el-dialog>
				</el-card>
				<el-card style="width: 45%;height: 300px;margin-left: 10%;" class="box-card">
					<div slot="header" class="clearfix">
						<span style="font-weight: bold;">企业管理员证照(图片大小不超过5M)</span>
					</div>
					<el-upload :action="upLoadUrl" list-type="picture-card"
						:on-preview="handlePictureCardPreview4" :limit="1" :on-remove="handleRemove4" :on-success="fileUpload4"
						:headers="headerObj">
						<i class="el-icon-plus"></i>
					</el-upload>
					<el-dialog :visible.sync="dialogVisible4">
						<img width="100%" :src="dialogImageUrl4" alt="">
					</el-dialog>
				</el-card>
			</div>

			<div style="width: 95%;margin: 0 auto;display: flex;margin-top: 30px;">
				<div style="width: 50%;">
					<div style="display: flex;">
						<i class="el-icon-upload"></i>一下材料二选一，要求能显示户名、账号及开户支行信息
					</div>
					<div>1、一般收款户：银行流水回单原件照片、网银截屏</div>
					<div>2、基本收款户：开户许可证原件照片</div>
				</div>
				<div style="width: 50%;margin-left: 10%;">
					<div style="display: flex;">
						<i class="el-icon-upload"></i>企业管理员证件照片、身份证则必须提供正反面，
						<div style="color: #FFBA00;">加盖公章</div>
					</div>
					<div>请务必与用户信息中填写的证件信息一致</div>

				</div>
			</div>

			<div style="display: flex;width: 95%;margin: 0 auto;margin-top: 50px;">
				<el-card style="width: 45%;height: 300px;" class="box-card">
					<div slot="header" class="clearfix">
						<span style="font-weight: bold;">企业管理员授权书(图片大小不超过5M)</span>
					</div>
					<el-upload :action="upLoadUrl" list-type="picture-card"
						:on-preview="handlePictureCardPreview5" :limit="1" :on-remove="handleRemove5" :on-success="fileUpload5"
						:headers="headerObj">
						<i class="el-icon-plus"></i>
					</el-upload>
					<el-dialog :visible.sync="dialogVisible5">
						<img width="100%" :src="dialogImageUrl5" alt="">
					</el-dialog>
				</el-card>
				<el-card style="width: 45%;height: 300px;margin-left: 10%;" class="box-card">
					<div slot="header" class="clearfix">
						<span style="font-weight: bold;">管理员手持证件照(图片大小不超过5M)</span>
					</div>
				<el-upload :action="upLoadUrl" list-type="picture-card"
					:on-preview="handlePictureCardPreview6" :limit="1" :on-remove="handleRemove6" :on-success="fileUpload6"
					:headers="headerObj">
					<i class="el-icon-plus"></i>
				</el-upload>
				<el-dialog :visible.sync="dialogVisible6">
					<img width="100%" :src="dialogImageUrl6" alt="">
				</el-dialog>
				</el-card>
			</div>

			<div style="width: 95%;margin: 0 auto;display: flex;margin-top: 30px;">
				<div style="width: 50%;">
					<div style="display: flex;">
						<i class="el-icon-upload"></i>
						<div>请下载 </div>
						<div style="color: #1890FF;margin-left: 10px;">企业管理员授权模板</div>
						<div style="color: #FFBA00;">，加盖公章</div>
						<div>，拍照上传</div>
					</div>

				</div>
			</div>

			<div
				style="width: 100%;height: 100px;margin: 0 auto;display: flex;margin-top: 100px;box-shadow: 0px 0px 10px 0px #b8b8b8;">
				<div style="width: 100px;height: 40px;margin: 0 auto;display: flex;align-self: center;">
					<el-button type="infor" @click="backAuth" size="medium">上一步</el-button>
					<el-button type="primary" @click="goAudit" size="medium">下一步</el-button>
				</div>
			</div>
		</div>
		<div class="fatherBox1" v-if="active == 4">
			<div style="width: 95%;height: 200px;margin: 0 auto;background-color: #E9F4FC;margin-top: 30px;display: flex;">
				<div style="width: 15%;height: 200px;display: flex;">
					<!-- <div style="height: 100px;width: 100px;margin: 0 auto;background-color: #30B08F;align-self: center;"></div> -->
					<img style="height: 100px;width: 100px;margin: 0 auto;align-self: center;" src="../../../assets/img/success.png" >
				</div>
				<div style="width: 85%;height: 200px;">
					<div style="font-size: 35px;color: #5FA0A7;font-weight: bold;line-height: 200px;">您的认证申请已提交，请耐心等待审核结果！</div>

				</div>
			</div>
			<div style="padding: 50px 0 0 16%;letter-spacing: 1px;margin-bottom: 50px;">
				<div style="display: flex;"> 我们的审核时限为72小时（3个工作日），遇到法定节日顺延，审核结果会短信通知您。</div>
				<div style="margin-top: 10px;color: #1890FF;">点击查看已提交的认证信息>></div>
			</div>

		</div>
		<el-dialog title="平台认证用户服务协议" style="height: 500px;width: 100%;" :visible.sync="centerDialogVisible"
			width="70%" center>
			<div style="text-align: center;">xxx</div>
			<span slot="footer" class="dialog-footer">
				<el-button @click="centerDialogVisible = false">取 消</el-button>
				<el-button type="primary" @click="centerDialogVisible = false">确 定</el-button>
			</span>
		</el-dialog>
	</div>
</template>

<script>
  	import CustomerApi from '@/api/basic/CustomerApi'
    import UserApi from '@/api/system/UserApi'
    import appConstant from '@/constant/AppConstant'
	export default {
		data() {
			return {
        options: {
          ownerIdTypes: appConstant.ownerIdTypes,
          ownerUserIdTypes: appConstant.ownerIdTypes,
        },
        upLoadUrl:'http://localhost:9527/system/file/upload',
        headerObj:{
        	Authorization: Cookies.get(TokenKey)
        },
        dialogImageUrl1: '', //信用代码证本地地址
        dialogImageUrl2: '', //法人代表证照本地地址
        dialogImageUrl3: '', //银行账户证明本地地址
        dialogImageUrl4: '', //企业管理员证照本地地址
        dialogImageUrl5: '', //企业管理员授权书证本地地址
        dialogImageUrl6: '', //管理员手持证件照本地地址
        dialogVisible1: false, //信用代码证查看状态
        dialogVisible2: false, //法人代表证照查看状态
        dialogVisible3: false, //银行账户证明查看状态
        dialogVisible4: false, //企业管理员证照查看状态
        dialogVisible5: false, //企业管理员授权书查看状态
        dialogVisible6: false, //管理员手持证件照查看状态
				dialogImageUrl: '', //信用代码证
				dialogVisible: false, //信用代码证
				gotop: false, //回到顶部
				active: 1, //步骤进行数
				centerDialogVisible: true, //协议框
				dataForm: { //企业银行信息
         id: '',
					yaoqingma: '', //邀请码
          customerType: '',
					bizLicenceNo: '', //信用代码
					customerName: '', //姓名
					ownerIdType: '', //证件类型
					ownerIdNo: '', //证件号
					address: '', //地址
					bankAddress: '', //详细地址
					bankAccount: '', //银行账号
					bankName: '', //账户名称
					bankOpenBranch: '', //开户行
					bankDepositName: '', //
					bankAddress: '' //具体网点
				},
				adminForm: { //管理员信息
          id: '',
					userName: '', //登录名
					nickName: '', //管理员姓名
					ownerIdType: '', //证件类型
					idCardNo: '', //证件号码
					email: '' //邮箱
				},
        imgForm:{
        	xydm:'',
        	frdb:'',
        	yhzm:'',
        	imgAdmin:'',
        	adminText: '',
        	adminImg:''
        },
				rules: { //企业信息
					bizLicenceNo: [{
						required: true,
						message: '请输入信用代码',
						trigger: 'blur'
					}],
					ownerName: [{
						required: true,
						message: '请输入法人/股东姓名',
						trigger: 'blur'
					}],
					ownerIdType: [{
						required: true,
						message: '请选择证件类型',
						trigger: 'blur'
					}],
					ownerIdNo: [{
						required: true,
						message: '请输入证件号',
						trigger: 'blur'
					}]
				},
				rules2: { //银行信息
					bankAccount: [{
						required: true,
						message: '请输入银行账号',
						trigger: 'blur'
					}],
					bankName: [{
						required: true,
						message: '请选择开户行',
						trigger: 'blur'
					}]

				},
				rules3: { //用户信息
					loginName: [{
						required: true,
						message: '请输入登录名',
						trigger: 'blur'
					}],
					adminName: [{
						required: true,
						message: '请输入管理员姓名',
						trigger: 'blur'
					}],
					leixing: [{
						required: true,
						message: '请选择证件类型',
						trigger: 'blur'
					}],
					zhengjianhaoma: [{
						required: true,
						message: '请输入证件号码',
						trigger: 'blur'
					}],
					email: [{
						required: true,
						message: '请输入邮箱',
						trigger: 'blur'
					}]
				}
			}
		},
    created() {
    	CustomerApi.getMyCustInfor().then(response => {
    		this.dataForm = response.data
    	})
      UserApi.getMyInfor().then(response => {
      	this.adminForm = response.data
      })
    },
		mounted() {
			document.querySelector('body').setAttribute('style', 'background-color:#F5F7FA')
			window.addEventListener("scroll", this.handleScroll, true);
		},
		beforeDestroy() {
			document.querySelector('body').removeAttribute('style')
		},
		methods: {
      fileUpload1(e){//统一社会信用代码证回调
      	this.imgForm.xydm = e.data
      	console.log(e)
      },
      fileUpload2(e){//法人代表证照回调
      	this.imgForm.frdb = e.data
      },
      fileUpload3(e){//银行账户证明回调
      	this.imgForm.yhzm = e.data
      },
      fileUpload4(e){//企业管理员证照回调
      	this.imgForm.imgAdmin = e.data
      },
      fileUpload5(e){//企业管理员授权回调
      	this.imgForm.adminText = e.data
      },
      fileUpload6(e){//管理员手持证件照回调
      	this.imgForm.adminImg = e.data
      },
		backAuth(){
			this.active = 2;
			this.toTop()
		},
		goAudit(){
			console.log(this.imgForm)
			this.active = 4;
			this.toTop()
			setTimeout(()=>{
				this.$router.push({path:'/'})
			},2000)
		},
    handleRemove1(file, fileList) { //信用代码证上传
    	this.imgForm.xydm = ''
    },
    handlePictureCardPreview1(file) { //信用代码证上传
    	this.dialogImageUrl1 = file.url;
    	console.log(file.url)
    	this.dialogVisible1 = true;
    },
    handleRemove2(file, fileList) { //信用代码证上传
    	this.imgForm.frdb = ''
    },
    handlePictureCardPreview2(file) { //信用代码证上传
    	this.dialogImageUrl2 = file.url;
    	console.log(file.url)
    	this.dialogVisible2 = true;
    },
    handleRemove3(file, fileList) { //信用代码证上传
    	this.imgForm.yhzm = ''
    },
    handlePictureCardPreview3(file) { //信用代码证上传
    	this.dialogImageUrl3 = file.url;
    	console.log(file.url)
    	this.dialogVisible3 = true;
    },
    handleRemove4(file, fileList) { //信用代码证上传
    	this.imgForm.imgAdmin = ''
    },
    handlePictureCardPreview4(file) { //信用代码证上传
    	this.dialogImageUrl4 = file.url;
    	console.log(file.url)
    	this.dialogVisible4 = true;
    },
    handleRemove5(file, fileList) { //信用代码证上传
    	this.imgForm.adminText = ''
    },
    handlePictureCardPreview5(file) { //信用代码证上传
    	this.dialogImageUrl5 = file.url;
    	console.log(file.url)
    	this.dialogVisible5 = true;
    },
    handleRemove6(file, fileList) { //信用代码证上传
    	this.imgForm.adminImg = ''
    },
    handlePictureCardPreview6(file) { //信用代码证上传
    	this.dialogImageUrl6 = file.url;
    	console.log(file.url)
    	this.dialogVisible6 = true;
    },
			handleRemove(file, fileList) { //信用代码证上传
				console.log(file, fileList);
			},
			handlePictureCardPreview(file) { //信用代码证上传
				this.dialogImageUrl = file.url;
				this.dialogVisible = true;
			},
			handleScroll() { //回到顶部
				let scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
				scrolltop > 30 ? (this.gotop = true) : (this.gotop = false);
			},
			toTop() { //回到顶部
				let top = document.documentElement.scrollTop || document.body.scrollTop;
				// 实现滚动效果
				const timeTop = setInterval(() => {
					document.body.scrollTop = document.documentElement.scrollTop = top -= 50;
					if (top <= 0) {
						clearInterval(timeTop);
					}
				}, 10);
			},
			backUser() {
				this.active = 1;
				this.toTop()
			},
			goAuth(formName3) {
				this.$refs[formName3].validate((valid) => {
					if (valid) {
						this.active = 3;
            UserApi.updateCompany(this.adminForm).then(response => {
              this.$message.success('更新成功')
            })
						this.toTop()
					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},

			submitForm(formName) {
				this.$refs[formName].validate((valid) => {
					if (valid) {
						this.submitForm2('dataForm2')
						this.toTop()
					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			submitForm2(formName) {
				this.$refs[formName].validate((valid) => {
					if (valid) {
						this.active = 2;
            CustomerApi.updateCompany(this.dataForm).then(response => {
                  this.$message.success('更新成功')
            })

						this.toTop()
					} else {
						console.log('error submit!!');
						return false;
					}
				});
			},
			resetForm(formName) {
				this.$refs[formName].resetFields();
				this.toTop()
			}
		},
	}
</script>

<style>
	.ImgBg1 {
		height: 1600px;
		width: 100%;
	}

	.topBar {
		position: fixed;
		top: 0;
		height: 80px;
		width: 100%;
		background-color: #FFFFFF;
		box-shadow: 0px 5px 19px 0px #b8b8b8;
		z-index: 999;
	}

	.secondBar {
		width: 90%;
		height: 80px;
		margin: 0 auto;
		display: flex;
	}

	.imgBox {
		width: 100px;
		height: 60px;
		/* margin-top: 10px; */
		align-self: center;
	}

	.lineBar {
		height: 35px;
		width: 2px;
		background-color: #001528;
		align-self: center;
		margin-left: 20px;
	}

	.title {
		margin-left: 20px;
		font-size: 25px;
		font-weight: bold;
		align-self: center;
	}

	.fatherBox {
		/* height: 850px; */
		width: 90%;
		margin: 0 auto;
		margin-top: 5%;
		background-color: #FFFFFF;
		border: 1px solid #EEEEEE;
	}

	.fatherBox1 {
		/* height: 400px; */
		width: 90%;
		margin: 0 auto;
		margin-top: 5%;
		background-color: #FFFFFF;
		border: 1px solid #EEEEEE;
	}

	.formBox {
		width: 80%;
		margin: 0 auto;
		border: 1px solid #EEEEEE;
	}

	.demo-ruleForm {
		width: 60%;
		margin: 0 auto;
		/* border: 1px solid #EEEEEE; */

	}
</style>
